<!-- 规格弹窗 -->
<template>

	<!-- TODO iphoneX适配 -->
	<view v-if="showFlag" @click="closeModalHandler()" class="bg-Container">
		<view class="outer-Container" @click.stop="stopHandler()">

			<!-- 关闭弹窗 -->
			<image @click="closeModalHandler" :src="icon.closeModalBtn" class="closeModalBtn"></image>


			<!-- 规格列表 -->
			<view class="specOuter-Container">

				<!-- 当前规格 -->
				<view class="currSpec-Container">
					<view>
						<!-- <image class="specCover" :src="imgSite + getGoodsCoverPicture(matchingData.goodsDetailJson)" mode=""></image> -->
						<image class="specCover" :src="imgSite + goodsDetail.coverPicture" mode=""></image>

						<view class="rightInfo-Container">
							<!-- 销售策略 10：现金 20：现金＋积分 40：积分 60:水券 70:水券 + 现金 -->
							<view v-if="goodsDetail.salesStrategy == 10" class='price'>
								<text>￥</text>
								<text>{{(matchingData.salesPrice / 100).toFixed(2)}}</text>
							</view>
							<view v-if="goodsDetail.salesStrategy == 20" class='price'>
								<text>￥</text>
								<text>{{(matchingData.salesPrice / 100).toFixed(2)}}</text>
								<!-- <text v-if="matchingData.salesPoint">
									<text class="plus">+</text>
									<text class="price-int">{{ matchingData.salesPoint }}</text>
									<text class="points">积分</text>
								</text> -->
							</view>
							<!-- <view v-if="goodsDetail.salesStrategy == 40" class='price'>
								<text v-if="matchingData.salesPoint">
									<text class="price-int">{{ matchingData.salesPoint }}</text>
									<text class="points">积分</text>
								</text>
							</view>
							<view v-if="goodsDetail.salesStrategy == 60" class='price'>
								<text v-if="matchingData.waterCoupon">
									<text class="price-int">{{ matchingData.waterCoupon / 100 }}</text>
									<text class="points">水券</text>
								</text>
							</view>
							<view v-if="goodsDetail.salesStrategy == 70" class='price'>
								<text>￥</text>
								<text>{{matchingData.salesPrice / 100}}</text>
								<text v-if="matchingData.waterCoupon">
									<text class="plus">+</text>
									<text class="price-int">{{ matchingData.waterCoupon / 100 }}</text>
									<text class="points">水券</text>
								</text>
							</view> -->
							<view v-if="goodsDetail.salesStrategy == 100" class='price'>
								<text>￥</text>
								<text>{{(matchingData.salesPrice / 100).toFixed(2)}}</text>
							</view>


							<!-- 销售专区 -->
							<!-- 销售专区 10：购物专区 30：积分专区 50:会员专区 (对应PC芬尼湾V卡) 60:水券专区 -->
							<view v-if="getShowMemberFlag()">
								<view v-if="matchingData.levelName && matchingData.memberPrice" class="vip-Container">
									<view class="vipLevelName">
										{{matchingData.levelName}}
									</view>
									<view class="vipPrice">
										<text class="money-icon">￥</text>
										<text class="price-int">{{matchingData.memberPrice / 100}}</text>
										<!-- <text class="price-float">.00</text> -->
									</view>
								</view>
							</view>

							<view class="stock-Container">
								库存：<text>{{matchingData.stock}}</text>件
							</view>
						</view>
					</view>

					<view class="topLine borderOneRpx">
					</view>
				</view>


				<!-- 规格数据 -->
				<scroll-view scroll-y="true" class="specGroup-ScrollView">
					<view v-for="(specGroup, n) in arrangementCombination" :key="n" class="specList-Container">
						<view class="title">
							{{specGroup.name}}
						</view>
						<view class="scrollView-Container">
							<span style="display: none;">{{JSON.stringify(specGroup)}}</span>
							<view v-for="(oItem, index) in specGroup.list" :key="index" v-on:click="chooseItem(oItem.name,n,$event,index,true)"
							 v-bind:class="[oItem.isShow?'':'disabled',subIndex[n] == index?'currSpec':'']" class="oneSpec">
								{{oItem.name}}
							</view>
						</view>

						<view class="topLine borderOneRpx">
						</view>
					</view>
				</scroll-view>


				<!-- 数量 -->
				<view class="buyCount-Container specList-Container">
					<view class="title">
						数量
					</view>

					<!-- 砍价只能购买1件 -->
					<view v-if="goodsDetail.activityType == 5" class="count-Content">
						<view class="minusOne">
							<image :src="icon.minus_disabled" mode=""></image>
						</view>
						<view class="inputCount">
							<input type="text" value="1" disabled="" />
						</view>
						<view class="addOne">
							<image :src="icon.add_disabled" mode=""></image>
						</view>
					</view>
					<view v-else class="count-Content">
						<view @click="minusOneHandler" class="minusOne">
							<image v-if="buyCount > 1" :src="icon.minus_active" mode=""></image>
							<image v-else :src="icon.minus_disabled" mode=""></image>
						</view>
						<view class="inputCount">
							<input type="text" v-model="buyCount" value="" />
						</view>
						<view @click="addOneHandler" class="addOne">
							<image :src="icon.add_active" mode=""></image>
						</view>
					</view>
				</view>
			</view>


			<!-- 底部按钮 -->
			<view v-if="specType == 'all'" class="btnsOuter-Container">
				<view @click="sureOperateHandler('addCart')" class="cartBtn-Container">
					加入购物车
				</view>
				<view @click="sureOperateHandler('buyNow')" class="buyBtn-Container">
					立即购买
				</view>
			</view>
			<view v-else class="btnsOuter-Container">
				<view @click="sureOperateHandler()" class="sureBtn-Container">
					确定
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';

	export default {
		filters: {

			//商品图片
			getGoodsCoverPicture(goodsDetailJson) {
				try {
					return JSON.parse(goodsDetailJson)['coverPicture'];
				} catch (e) {
					return "";
				}
			}
		},
		computed: {
			...mapState(['imgSite', 'hasLogin'])
		},
		data() {
			return {
				icon: {
					closeModalBtn: "/static/images/common/closeModal.png",

					add_active: "/static/images/detail/add_active.png",
					add_disabled: "/static/images/detail/add_disabled.png",
					minus_active: "/static/images/detail/minus_active.png",
					minus_disabled: "/static/images/detail/minus_disabled.png",

					youhuiquan: '/static/images/coupon/youhuiquan.png',
					youhui_zk: '/static/images/coupon/youhui_zk.png',
				},

				//初始化标记
				isFirstFlag: false,

				//规格操作数据
				selectArr: [], //存放被选中的值
				shopItemInfo: {}, //存放要和选中的值进行匹配的数据
				subIndex: [], //是否选中 因为不确定是多规格还是但规格，所以这里定义数组来判断
				tempSubIndex: [],

				//匹配规格数据
				matchingFlag: false,
				matchingData: {},

				//购买数量
				buyCount: 1
			}
		},
		props: {
			showFlag: {
				type: Boolean,
				default: false
			},
			specType: {
				type: String,
				default: 'all'
			},
			preGroupInfo: {},


			// //显示规格
			// defaultMatchingData: {},

			//商品信息
			goodsDetail: {},

			//默认规格
			defaultSpecAttr: Array,

			//规格数据
			specSourceArrayList: Array,

			//排列组合
			arrangementCombination: Array
		},
		methods: {

			// 显示会员价逻辑
			getShowMemberFlag(item) {

				var item = this.matchingData;

				if (this.goodsDetail.customerLevelId &&
					(this.goodsDetail.salesStrategy == 10 || this.goodsDetail.salesStrategy == 20 || this.goodsDetail.salesStrategy ==
						70) &&
					(item.levelName && item.memberPrice)) {

					return true;
				} else {
					return false;
				}
			},

			//关闭弹窗
			closeModalHandler() {
				if (!this.matchingFlag) {
					this.subIndex = this.tempSubIndex;
					this.subIndex = JSON.parse(JSON.stringify(this.tempSubIndex));
				}

				this.$emit('closeModalHandler');
			},
			stopHandler() {

			},


			//选择规格
			chooseItem(item, n, event, index, clickFlag) {
				if (this.selectArr[n] != item) {
					this.$set(this.selectArr, n, item);
					this.$set(this.subIndex, n, index);
				} else {
					this.$set(this.selectArr, n, '');
					this.$set(this.subIndex, n, -1); //去掉选中颜色
				}
				this.checkItem(n, clickFlag);
			},


			//校验规格 
			checkItem(clickIndex, clickFlag) {
				var option = this.arrangementCombination;
				for (let i = 0, len = option.length; i < len; i++) {
					if (i == clickIndex) {
						continue;
					}
					let len2 = option[i].list.length;
					for (let j = 0; j < len2; j++) {
						if (this.subIndex[i] != -1 && j == this.subIndex[i]) {
							continue;
						}
						let choosed_copy = [...this.selectArr];
						this.$set(choosed_copy, i, this.arrangementCombination[i].list[j].name);
						let choosed_copy2 = choosed_copy.filter(item => item !== '' && typeof item !== 'undefined');

						console.log(this.shopItemInfo.hasOwnProperty(choosed_copy2));
						if (this.shopItemInfo.hasOwnProperty(choosed_copy2)) {
							//TODO库存不足->false
							this.$set(this.arrangementCombination[i].list[j], 'isShow', true);
						} else {
							this.$set(this.arrangementCombination[i].list[j], 'isShow', false);
						}
					}
				}


				//匹配数据
				this.matchingFlag = false;
				for (var i = 0; i < this.specSourceArrayList.length; i++) {
					var specData = this.specSourceArrayList[i];
					if (specData.attributeStr == this.selectArr.join(",")) {
						this.matchingFlag = true;
						this.matchingData = specData;
						this.tempSubIndex = JSON.parse(JSON.stringify(this.subIndex));


						//拼团预售起批数
						if (this.goodsDetail.activityType == 6) {
							this.buyCount = this.matchingData.activityGroupMinNum;
						} else {
							this.buyCount = 1;
						}
					}
				}

				//详情规格信息
				if (this.matchingFlag && clickFlag) {
					var params = {
						matchingData: this.matchingData
					};
					this.$emit('changeSpecHandler', params);
				}
			},


			//排列组合
			initializeData() {
				let result = this.specSourceArrayList.reduce(
					(arrs, items) => {
						return arrs.concat(
							items.attributeStr.split(',').reduce(
								(arr, item) => {
									return arr.concat(
										arr.map(item2 => {
											//利用对象属性的唯一性实现二维数组去重
											if (!this.shopItemInfo.hasOwnProperty([...item2, item])) {
												this.shopItemInfo[[...item2, item]] = items;
											}
											return [...item2, item];
										})
									);
								},
								[
									[]
								]
							)
						);
					},
					[
						[]
					]
				);
			},


			//默认规格初始化
			initDefaultSpecHandler() {

				if (!this.isFirstFlag) {

					this.initializeData();
					this.checkItem(-1);

					//默认规格
					var defaultSpecAttr = this.defaultSpecAttr;
					var arrangementCombination = this.arrangementCombination;
					for (let m = 0; m < arrangementCombination.length; m++) {

						for (let n = 0; n < arrangementCombination[m].list.length; n++) {

							if (arrangementCombination[m].list[n].name == defaultSpecAttr[m].value) {
								// this.chooseItem("黑色", 0, null, 0);
								// this.chooseItem("32GB", 1, null, 0);
								this.chooseItem(defaultSpecAttr[m].value, m, null, n);
							}
						}
					}

					this.isFirstFlag = true;


					//拼团预售起批数
					if (this.goodsDetail.activityType == 6) {
						this.buyCount = this.matchingData.activityGroupMinNum;
					} else {
						this.buyCount = 1;
					}
				}
			},


			//商品图片
			getGoodsCoverPicture(goodsDetailJson) {
				try {
					return JSON.parse(goodsDetailJson)['coverPicture'];
				} catch (e) {
					return "";
				}
			},


			//数量操作
			minusOneHandler() {

				// 拼团预售起批数
				if (this.goodsDetail.activityType == 6) {
					if (this.buyCount <= this.matchingData.activityGroupMinNum) {
						this.$api.msg("最少购买" + this.matchingData.activityGroupMinNum + "件!");
						this.buyCount = this.matchingData.activityGroupMinNum;
						return;
					}
				} else {
					if (this.buyCount == 1) {
						this.$api.msg("最少购买1件!");
						this.buyCount = 1;
						return;
					}
				}

				this.buyCount = parseInt(this.buyCount) - 1;
				// this.$emit("minusOneHandler", this.buyCountModal);
			},
			addOneHandler() {

				// 最大购买数
				if (this.buyCount >= this.matchingData.stock) {
					this.buyCount = parseInt(this.matchingData.stock);
					this.$api.msg("最多购买" + this.matchingData.stock + "件!");
					return;
				} else {
					this.buyCount = parseInt(this.buyCount) + 1;
				}

				// this.$emit("addOneHandler", this.buyCountModal);
			},


			//确定操作
			sureOperateHandler(specType) {

				//选中所有规格
				var allflag = true;
				for (var i = 0; i < this.subIndex.length; i++) {
					if (this.subIndex[i] == -1) {
						allflag = false;
						break;
					}
				}
				if (!allflag) {
					this.$api.msg("请选择规格!");
					return;
				}


				// 购买数量控制
				// 未输入购买数
				if (!this.buyCount) {
					this.$api.msg("请输入购买数量!");
					return;
				} else if (isNaN(this.buyCount)) {
					this.$api.msg("购买数量必须是数字!");
					return;
				}
				// 最大购买数
				if (this.buyCount > this.matchingData.stock) {
					this.buyCount = this.matchingData.stock;
					this.$api.msg("购买数量超出库存!");
					return;
				}

				// 拼团预售起批数
				if (this.goodsDetail.activityType == 6) {
					if (this.buyCount < this.matchingData.activityGroupMinNum) {
						this.buyCount = this.matchingData.activityGroupMinNum;
						this.$api.msg("最少购买" + this.matchingData.activityGroupMinNum + "件!");
						return;
					}
				} else {
					if (this.buyCount < 1) {
						this.$api.msg("最少购买1件!");
						this.buyCount = 1;
						return;
					}
				}


				//弹窗类型
				if (!specType) {
					specType = this.specType;
				}

				let that = this;
				var url = "";
				var addFlag = 0;
				var addChannel = 0; //10:PC 20:WAP 30:APP 40：小程序

				// #ifdef H5
				addChannel = 20;
				// #endif
				// #ifdef APP-PLUS
				addChannel = 30;
				// #endif
				// #ifdef MP-WEIXIN
				addChannel = 40;
				// #endif


				//加入购物车
				if ("addCart" == specType) {
					addFlag = 10;
					url = "/ShopCartApi/addShopCartForApi";

					var goodsId = this.matchingData.goodsId;
					var vendorId = JSON.parse(this.matchingData.goodsDetailJson).vendorId;
					var activityId = this.matchingData.activityId;
					that.$api.globalUtil.requestAjax({
						url: url,
						method: "POST",
						data: {
							shopCartForms: [{
								goodsId: goodsId, //商品SKU
								shopId: vendorId, //店铺id
								activityId: activityId, //活动id
								num: that.buyCount, //加入数量
								addChannel: addChannel, //加入渠道 10:PC 20:WAP 30:APP 40：小程序
								addFlag: addFlag //加入标识 10:加入购物车 20:立即购买
							}]
						},
						success: function(res) {
							if (res.data.success) {
								that.closeModalHandler();
								that.$api.msg("加入购物车成功");

								var params = {
									matchingData: that.matchingData
								};
								that.$emit('changeSpecHandler', params);
								that.$emit('setTabBarBadge');
								that.$api.globalUtil.setTabBarBadge();
							}
						}
					});
				}


				//立即购买 [发起&参与拼团]
				if ("buyNow" == specType || "startGroup" == specType || "attend" == specType) {
					addFlag = 20;
					url = "/ShopCartApi/addShopCartFastBuyForApi";

					var goodsId = this.matchingData.goodsId;
					var vendorId = JSON.parse(this.matchingData.goodsDetailJson).vendorId;
					var activityId = this.matchingData.activityId;
					that.$api.globalUtil.requestAjax({
						url: url,
						method: "POST",
						data: {
							goodsId: goodsId, //商品SKU
							shopId: vendorId, //店铺id
							activityId: activityId, //活动id
							num: that.buyCount, //加入数量
							addChannel: addChannel, //加入渠道 10:PC 20:WAP 30:APP 40：小程序
							addFlag: addFlag //加入标识 10:加入购物车 20:立即购买
						},
						success: function(res) {
							if (res.data.success) {
								that.closeModalHandler();
								// that.$api.msg("立即购买成功");

								var params = {
									matchingData: that.matchingData
								};
								that.$emit('changeSpecHandler', params);

								var flag = res.data.response.shopCartSplitForms[0].type == 10 ? 0 : 1;
								uni.setStorageSync('shopCartData', JSON.stringify(res.data.response.shopCartSplitForms));
								let contribution = 0; // 贡献值
								res.data.response.shopCartSplitForms.forEach(i => i.shopCartGoodsForms.forEach(item => {
									contribution += item.contribution * item.num
								}))
								uni.setStorageSync('contribution', contribution);
								if ("startGroup" == specType) {
									var preGroupInfo = {
										activityGroupMainId: that.matchingData.activityGroupMainId,
										activityGroupId: ""
									};
									uni.navigateTo({
										url: '/pagesOrder/createOrder?taxationFlag=' + flag + '&preGroupInfo=' + JSON.stringify(preGroupInfo)
									});
								} else if ("attend" == specType) {
									uni.navigateTo({
										url: '/pagesOrder/createOrder?taxationFlag=' + flag + '&preGroupInfo=' + JSON.stringify(that.preGroupInfo)
									});
								} else {
									uni.navigateTo({
										url: '/pagesOrder/createOrder?taxationFlag=' + flag
									});
								}
							}
						}
					});
				}

				//发起砍价
				if ("bargain" == specType) {

					var params = {
						matchingData: that.matchingData
					};
					that.$emit("sureOperateHandler", params);
				}
			}
		}
	}
</script>

<style lang="less">
	.bg-Container {
		z-index: 99999;
		position: fixed;
		top: 0;
		width: 100vw;
		height: 100vh;
		background: rgba(0, 0, 0, 0.7);

		// 弹窗标题
		.modalTitle {
			margin-top: 50rpx;
			margin-bottom: 75rpx;
			width: 100%;
			height: 30rpx;
			line-height: 30rpx;
			text-align: center;
			font-size: 30rpx;
			font-family: PingFang SC;
			// font-weight:bold;
			color: rgba(51, 51, 51, 1);
		}

		// 关闭按钮
		.closeModalBtn {
			z-index: 99999;
			position: absolute;
			top: 36rpx;
			right: 36rpx;
			width: 25rpx;
			height: 24rpx;
		}

		// 外层容器
		.outer-Container {
			z-index: 99999;
			position: fixed;
			bottom: 0;
			width: 100%;
			height: 1100rpx;
			background: rgba(255, 255, 255, 1);
			box-shadow: 0px 0px 26rpx 0px rgba(143, 143, 143, 0.14);
			border-radius: 16rpx 16rpx 0px 0px;

			// 底部按钮
			.btnsOuter-Container {
				display: flex;
				justify-content: space-between;
				position: absolute;
				bottom: 0;
				padding: 0 30rpx;
				width: 100%;
				height: 140rpx;

				.cartBtn-Container {
					width: 330rpx;
					height: 70rpx;
					line-height: 70rpx;
					text-align: center;
					font-size: 30rpx;
					font-family: PingFang SC;
					color: #FFFFFF;
					background: linear-gradient(135deg, #FE5E49 0%, #D21728 100%);
					// background:#FE5E49;
					border-radius: 35rpx;
				}

				.buyBtn-Container {
					width: 330rpx;
					height: 70rpx;
					line-height: 70rpx;
					text-align: center;
					font-size: 30rpx;
					font-family: PingFang SC;
					color: #FFFFFF;
					background: linear-gradient(-45deg, #FF7E00 0%, #FF9C00 100%);
					// background:#FE5E49;
					border-radius: 35px;
				}

				.sureBtn-Container {
					width: 690rpx;
					height: 70rpx;
					background: #FE5E49;
					border-radius: 35rpx;

					text-align: center;
					font-size: 30rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: rgba(255, 255, 255, 1);
					line-height: 70rpx;
				}
			}
		}

		// 规格内容
		.specOuter-Container {

			// 当前规格
			.currSpec-Container {
				position: relative;
				display: flex;
				margin: 0 auto;
				padding-top: 66rpx;
				width: 690rpx;
				height: 302rpx;

				&>view {
					display: flex;
					width: 690rpx;
					height: 170rpx;
				}

				.specCover {
					width: 170rpx;
					height: 170rpx;
					border-radius: 10rpx;
				}


				.price {
					color: #FE5E49;
					font-size: 30rpx;
				}

				.plus {
					margin-left: 20rpx;
					margin-right: 20rpx;
					font-size: 40rpx;
					color: #FE5E49;
				}

				.points {
					font-size: 24rpx;
					color: #FE5E49;
				}


				.rightInfo-Container {
					display: flex;
					flex-direction: column;
					justify-content: space-between;
					padding: 18rpx 0 16rpx 36rpx;
					// width: 520rpx;
					height: 100%;

					.vip-Container {
						display: flex;
						position: relative;
						margin-top: 10rpx;
						width: auto;
						height: 32rpx;
						line-height: 32rpx;

						.vipLevelName {
							display: inline-block;
							box-sizing: border-box;
							padding: 0 12rpx;
							width: max-content;
							height: 32rpx;
							line-height: 32rpx;
							text-align: center;
							font-size: 20rpx;
							font-family: PingFang SC;
							color: rgba(253, 212, 85, 1);
							border-radius: 16rpx 0 0 16rpx;
							background: linear-gradient(-45deg, rgba(36, 45, 87, 1) 0%, rgba(24, 32, 70, 1) 100%);
						}

						.vipPrice {
							padding: 0 15rpx 0 12rpx;
							height: 32rpx;
							line-height: 32rpx;
							font-size: 18rpx;
							font-family: PingFang SC;
							font-weight: bold;
							color: rgba(25, 33, 72, 1);
							background: linear-gradient(-45deg, rgba(255, 205, 52, 1) 0%, rgba(255, 197, 20, 1) 100%);
							border-radius: 0px 16rpx 16rpx 0px;


							.money-icon {
								font-size: 18rpx;
								font-family: PingFang SC;
								font-weight: 500;
								color: rgba(25, 33, 72, 1);
							}

							.price-int {
								font-size: 24rpx;
								font-family: PingFang SC;
								font-weight: 500;
								color: rgba(25, 33, 72, 1);
							}

							.price-float {
								font-size: 18rpx;
								font-family: PingFang SC;
								font-weight: 500;
								color: rgba(25, 33, 72, 1);
							}
						}
					}

					.stock-Container {
						font-size: 24rpx;
						font-family: PingFang SC;
						// font-weight:500;
						color: rgba(153, 153, 153, 1);
					}
				}
			}

			// 规格列表
			.specGroup-ScrollView {
				height: 470rpx;

				.specList-Container {
					position: relative;
					margin: 0 auto;
					padding: 42rpx 0;
					width: 690rpx;

					.title {
						margin-bottom: 30rpx;
						font-size: 26rpx;
						font-family: PingFang SC;
						// font-weight:500;
						color: rgba(51, 51, 51, 1);
					}

					.scrollView-Container {
						display: flex;
						flex-wrap: wrap;

						.oneSpec {
							margin-bottom: 20rpx;
							margin-right: 30rpx;
							padding: 0 38rpx;
							height: 54rpx;
							line-height: 54rpx;
							text-align: center;
							font-size: 26rpx;
							font-family: PingFang SC;
							// font-weight:500;
							color: rgba(51, 51, 51, 1);
							background: rgba(238, 238, 238, 1);
							border-radius: 27px;
						}

						.oneSpec.currSpec {
							color: #FE5E49;
							background: #FFEDEB;
							border: 1rpx solid #FE5E49;
						}

						.oneSpec.disabled {
							pointer-events: none;
							color: rgba(188, 188, 188, 1);
							background: rgba(245, 245, 245, 1);
							border: 0;
						}
					}
				}
			}
		}
	}


	// 操作数量
	.buyCount-Container {
		display: flex;
		justify-content: space-between;
		padding: 0 30rpx;
		margin-top: 42rpx;

		.title {
			margin-bottom: 15rpx;
			font-size: 26rpx;
			font-family: PingFang SC;
			color: #333333;
		}

		.count-Content {
			display: flex;
			width: 170rpx;
			height: 50rpx;

			.minusOne {
				width: 50rpx;
				height: 50rpx;
				line-height: 50rpx;
				text-align: center;
				background: rgba(255, 255, 255, 1);
				border: 1rpx solid rgba(219, 219, 219, 1);
				border-radius: 5rpx 0px 0px 5rpx;
			}

			.inputCount {
				width: 80rpx;
				text-align: center;
				background: rgba(251, 251, 251, 1);
				border: 1rpx solid rgba(219, 219, 219, 1);
				border-left: 0;
				border-right: 0;
			}

			.addOne {
				width: 50rpx;
				height: 50rpx;
				line-height: 50rpx;
				text-align: center;
				background: rgba(255, 255, 255, 1);
				border: 1rpx solid rgba(219, 219, 219, 1);
				border-radius: 0 5rpx 5rpx 0;
			}

			.minusOne,
			.addOne {
				display: flex;
				align-items: center;
				justify-content: center;

				image {
					width: 30rpx;
					height: 30rpx;
				}
			}
		}
	}


	.topLine {
		position: absolute;
		bottom: 0;
		width: 690rpx;
		height: 1rpx;
	}

	.borderOneRpx:after {
		border-top: 0;
		border-left: 0;
		border-right: 0;
		border-color: rgba(238, 238, 238, 1);
	}
</style>
